﻿var timebanner = 10000;
var timebannerhome = 5000;

function banner1() {
    //Banner1 Top
    $("#paging a:first").addClass("active");
    var imageWidth = $("#window").width();
    var imageSum = $("#imagereel img").size();
    var imageReelWidth = imageWidth * (imageSum);
    $("#imagereel").css({ 'width': imageReelWidth });
    rotate = function () {
        var triggerID = $active.attr("rel") - 1;
        var image_reelPosition = triggerID * imageWidth;
        $("#paging a").removeClass('active');
        $active.addClass('active');
        $("#imagereel").animate({ left: -image_reelPosition }, 600);
    };
    rotateSwitch = function () {
        play = setInterval(function () {
            $active = $('#paging a.active').next();
            if ($active.length === 0) { $active = $('#paging a:first'); }
            rotate();
        }, timebanner); // este es el valor que define la velocidad (7 segundos)
    };
    rotateSwitch();
    $("#imagereel a").hover(function () { clearInterval(play); }, function () { rotateSwitch(); });
    $("#paging a").click(function () { $active = $(this); clearInterval(play); rotate(); rotateSwitch(); return false; });
}

function banner2() {
    //Banner1 Top
    $("#paging2 a:first").addClass("active");
    var imageWidth = $("#window2").width();
    var imageSum = $("#imagereel2 img").size();
    var imageReelWidth = imageWidth * (imageSum);
    $("#imagereel2").css({ 'width': imageReelWidth });
    rotate2 = function () {
        var triggerID2 = $active2.attr("rel") - 1;
        var image_reelPosition = triggerID2 * imageWidth;
        $("#paging2 a").removeClass('active');
        $active2.addClass('active');
        $("#imagereel2").animate({ left: -image_reelPosition }, 700);
    };
    rotateSwitch2 = function () {
        play = setInterval(function () {
            $active2 = $('#paging2 a.active').next();
            if ($active2.length === 0) { $active2 = $('#paging2 a:first'); }
            rotate2();
        }, timebanner); // este es el valor que define la velocidad (7 segundos)
    };
    rotateSwitch2();
    $("#imagereel2 a").hover(function () { clearInterval(play); }, function () { rotateSwitch2(); });
    $("#paging2 a").click(function () { $active2 = $(this); clearInterval(play); rotate2(); rotateSwitch2(); return false; });
}
function banner3() {
    //Banner1 Top
    $("#paging3 a:first").addClass("active");
    var imageWidth = $("#window3").width();
    var imageSum = $("#imagereel3 img").size();
    var imageReelWidth = imageWidth * (imageSum);
    $("#imagereel3").css({ 'width': imageReelWidth });
    rotate3 = function () {
        var triggerID3 = $active3.attr("rel") - 1;
        var image_reelPosition = triggerID3 * imageWidth;
        $("#paging3 a").removeClass('active');
        $active3.addClass('active');
        $("#imagereel3").animate({ left: -image_reelPosition }, 700);
    };
    rotateSwitch3 = function () {
        play = setInterval(function () {
            $active3 = $('#paging3 a.active').next();
            if ($active3.length === 0) { $active3 = $('#paging3 a:first'); }
            rotate3();
        }, timebanner); // este es el valor que define la velocidad (7 segundos)
    };
    rotateSwitch3();
    $("#imagereel3 a").hover(function () { clearInterval(play); }, function () { rotateSwitch3(); });
    $("#paging3 a").click(function () { $active3 = $(this); clearInterval(play); rotate3(); rotateSwitch3(); return false; });
}

function bannerhome() {
    //Banner1 Top
    $("#paging4 a:first").addClass("active");
    var imageWidth = $("#window4").width();
    var imageSum = $("#imagereel4 img").size();
    var imageReelWidth = imageWidth * (imageSum);
    $("#imagereel4").css({ 'width': imageReelWidth });
    rotate4 = function () {
        var triggerID4 = $active4.attr("rel") - 1;
        var image_reelPosition = triggerID4 * imageWidth;
        $("#paging4 a").removeClass('active');
        $active4.addClass('active');
        $("#imagereel4").animate({ left: -image_reelPosition }, 700);
    };
    rotateSwitch4 = function () {
        play = setInterval(function () {
            $active4 = $('#paging4 a.active').next();
            if ($active4.length === 0) { $active4 = $('#paging4 a:first'); }
            rotate4();
        }, timebannerhome); // este es el valor que define la velocidad (7 segundos)
    };
    rotateSwitch4();
    $("#imagereel4 a").hover(function () { clearInterval(play); }, function () { rotateSwitch4(); });
    $("#paging4 a").click(function () { $active4 = $(this); clearInterval(play); rotate4(); rotateSwitch4(); return false; });
}